/**
 *  Copyright � 2010 Digia Plc
 *  Copyright � 2010 Nokia Corporation
 *
 *  All rights reserved.
 *
 *  Nokia and Nokia Connecting People are registered trademarks of
 *  Nokia Corporation.
 *  Java and all Java-based marks are trademarks or registered
 *  trademarks of
 *  Sun Microsystems, Inc. Other product and company names
 *  mentioned herein may be
 *  trademarks or trade names of their respective owners.
 *
 *
 *  Subject to the conditions below, you may, without charge:
 *
 *  �  Use, copy, modify and/or merge copies of this software and
 *     associated documentation files (the "Software")
 *
 *  �  Publish, distribute, sub-licence and/or sell new software
 *     derived from or incorporating the Software.
 *
 *
 *  This file, unmodified, shall be included with all copies or
 *  substantial portions
 *  of the Software that are distributed in source code form.
 *
 *  The Software cannot constitute the primary value of any new
 *  software derived
 *  from or incorporating the Software.
 *
 *  Any person dealing with the Software shall not misrepresent
 *  the source of the Software.
 *
 *  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY
 *  KIND, EXPRESS OR IMPLIED,
 *  INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
 *  MERCHANTABILITY, FITNESS FOR A
 *  PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 *  AUTHORS OR COPYRIGHT
 *  HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
 *  WHETHER IN AN ACTION
 *  OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
 *  CONNECTION WITH THE
 *  SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 */
import Qt 4.7
import "javascript/profileFunctions.js" as ProFunc
import "../colibri"
import "styles"

Item {
    id: structure

    property CLStyle style : StyleHomeControlSystem{}
    property string currentMode: "Custom"

    signal profileChanged() // Triggered when profile is changed
    signal saunaTurnedOff() // Triggered when profile with sauna of is selected
    signal closeWindow()

    /**
     * Changes profile if it exists
     *
     * @param index Profile index
     * @return bool
     */
    function checkNewProfile( index ) {
        if( index < 0 || index > 4 ) return false;
        structure.profileChanged();
        if( index == 0 ) ProFunc.normalMode();
        if( index == 1 ) ProFunc.nightMode();
        if( index == 2 ) ProFunc.awayMode();
        if( index == 3 ) ProFunc.awayLongMode();
        if( index == 4 ) ProFunc.movieMode();
        return true;
    }

    /**
     * Sets current profile as Custom
     *
     * @return Nothing
     */
    function profileToCustom() {
        structure.currentMode = "Custom";
        listbox.clearSelections();
        ProFunc.hideAll()
    }

    width: 640
    height: 424

    MouseArea {
        anchors.fill: parent;
    }

    Rectangle{
        width:structure.width*0.955
        height:structure.height*0.924
        color:style.selectionColor
        anchors.centerIn:parent
        radius:7
    }

    Image {
        source: "images/control_bg_trans_420x275_png.png";
        anchors.fill: parent;
        smooth: true
        opacity:0.7
    }

    RoomExitButton {
        windowWidth: structure.width
        windowHeight: structure.height
        style: structure.style
        onClicked: structure.closeWindow();
    }

    Text {
        id: selectText
        text: "Profiles"
        font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) )
        x: Math.round( structure.width * 0.05 )
        y: Math.round( structure.height * 0.05 )
        color: structure.style.textColor
        font.bold: true
    }

    CLListbox {
        id: listbox
        x: Math.round( structure.width * 0.05 )
        width: Math.round( 200 * (structure.width/640) )
        anchors.top: selectText.bottom
        anchors.topMargin: Math.round( 10 * (structure.height / 424) )
        style: structure.style
        itemHeight: Math.round( 50 * (structure.height/424) )
        items: ListModel {
            ListElement { label: "Home"; value: 0; selected: false; }
            ListElement { label: "Night"; value: 1; selected: false; }
            ListElement { label: "Away"; value: 2; selected: false; }
            ListElement { label: "Away (long)"; value: 3; selected: false; }
            ListElement { label: "Movie"; value: 4; selected: false; }
        }
        selectMany: false
        onItemClicked: checkNewProfile(index);
        allowDeSelect: false
        fontSize: 1 + Math.round( 14 * (structure.height / 424) )
    }

    Rectangle {
        x: theColumn.x + Math.round( 8 * (structure.height / 424) )
        y: theColumn.y - Math.round( 16 * (structure.height / 424) )
        width: theColumn.width
        height: listbox.height - 2*border.width
        color: "transparent"
        border.width: 1
        border.color: style.borderColor
        smooth: true
        radius: 0.0000001
    }

    Column {
        id: theColumn
        x: Math.round( 240 * (structure.width/640) )
        y: Math.round( structure.height * 0.18 )
        width: Math.round( 360 * (structure.width/640) )
        height: Math.round( 330 * (structure.height/424) )
        spacing: Math.round( 8 * (structure.height/424) )

        Row {
            id: rowTemp

            property int theTemperature : 22
            property string text : "Temperature"
            property string text2 : ""+theTemperature+"<html>&deg;</html>C"

            visible: false
            x: Math.round(structure.height * 0.05)
            width: parent.width - x
            height: (visible)? Math.round(30 * (structure.height / 424)) : 0
            spacing: Math.round(6 * (structure.width / 640))

            Image { id: tempImg; smooth: true; width: parent.height; height: parent.height; source: "images/thermometer_40x40.png" }
            Rectangle {
                anchors.verticalCenter: parent.verticalCenter
                height: parent.height; width:(parent.width-parent.spacing-tempImg.width);
                color:  "transparent"
                Text { text: parent.parent.text; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; }
                Text { text: parent.parent.text2; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; anchors.right: parent.right; anchors.rightMargin: (longest.width-width); }
            }

        }

        Row {
            id: rowLight

            property string text : "Lights"
            property string text2 : "Off"

            visible: false
            x: Math.round( structure.height * 0.05 )
            width: parent.width - x
            height: (visible)? Math.round( 30 * (structure.height / 424) ) : 0
            spacing: Math.round( 6 * (structure.width / 640) )
            Image { id: lightImg; smooth: true; width: parent.height; height: parent.height; source: "images/lamp_off_100x100.png" }
            Rectangle {
                anchors.verticalCenter: parent.verticalCenter
                height: parent.height; width:(parent.width-parent.spacing-lightImg.width);
                color:  "transparent"
                Text { text: parent.parent.text; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; }
                Text { text: parent.parent.text2; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; anchors.right: parent.right; anchors.rightMargin: (longest.width-width); }
            }

        }

        Row {
            id: rowLightDim

            property string text : "LR lights"
            property string text2 : "10%"

            visible: false
            x: Math.round(structure.height * 0.05)
            width: parent.width - x
            height: (visible)? Math.round(30 * (structure.height / 424)) : 0
            spacing: Math.round(6 * (structure.width / 640))
            Image { id: lightDimImg; smooth: true; width: parent.height; height: parent.height; source: "images/lamp_on_30x30.png" }
            Rectangle {
                anchors.verticalCenter: parent.verticalCenter
                height: parent.height; width:(parent.width-parent.spacing-lightDimImg.width);
                color:  "transparent"
                Text { text: parent.parent.text; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; }
                Text { text: parent.parent.text2; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; anchors.right: parent.right; anchors.rightMargin: (longest.width-width); }
            }

        }

        Row {
            id: rowVolume

            property string text : "Audio"
            property string text2 : "Off"

            visible: false
            x: Math.round(structure.height * 0.05)
            width: parent.width - x
            height: (visible)? Math.round(30 * (structure.height / 424)) : 0
            spacing: Math.round(6 * (structure.width / 640))
            Image { id: volumeImg; smooth: true; width: parent.height; height: parent.height; source: "images/speaker_mute_100x100.png" }
            Rectangle {
                anchors.verticalCenter: parent.verticalCenter
                height: parent.height; width:(parent.width-parent.spacing-volumeImg.width);
                color:  "transparent"
                Text { text: parent.parent.text; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; }
                Text { text: parent.parent.text2; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; anchors.right: parent.right; anchors.rightMargin: (longest.width-width); }
            }

        }

        Row {
            id: rowVolumeMovie

            property string text : "LR audio"
            property string text2 : "80%"

            visible: false
            x: Math.round( structure.height * 0.05 )
            width: parent.width - x
            height: (visible)? Math.round(30 * (structure.height / 424)) : 0
            spacing: Math.round(6 * (structure.width / 640))
            Image { id: movieVolImg; smooth: true; width: parent.height; height: parent.height; source: "images/speaker_100x100.png" }
            Rectangle {
                anchors.verticalCenter: parent.verticalCenter
                height: parent.height; width:(parent.width-parent.spacing-movieVolImg.width);
                color:  "transparent"
                Text { text: parent.parent.text; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; }
                Text { text: parent.parent.text2; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; anchors.right: parent.right; anchors.rightMargin: (longest.width-width); }
            }

        }

        Row {
            id: rowSaunaOff

            property string text : "Sauna"
            property string text2 : "Off"

            visible: false
            x: Math.round(structure.height * 0.05)
            width: parent.width - x
            height: (visible)? Math.round(30 * (structure.height / 424)) : 0
            spacing: Math.round( 6 * (structure.width / 640) )
            Image { id: saunaImg; smooth: true; width: parent.height; height: parent.height; source: "images/sauna_40x40.png" }
            Rectangle{
                anchors.verticalCenter: parent.verticalCenter
                height: parent.height; width:(parent.width-parent.spacing-saunaImg.width);
                color:  "transparent"
                Text { text: parent.parent.text; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; }
                Text { text: parent.parent.text2; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; anchors.right: parent.right; anchors.rightMargin: (longest.width-width); }
            }
        }

        Row {
            id: rowLockOpen

            property string text : "Doors"
            property string text2 : "Open"

            visible: false
            x: Math.round(structure.height * 0.05)
            width: parent.width - x
            height: (visible)? Math.round(30 * (structure.height / 424)) : 0
            spacing: Math.round(6 * (structure.width / 640))
            Image { id: lockOpenImg; smooth: true; width: parent.height; height: parent.height; source: "images/lock_open_100x100.png" }
            Rectangle {
                anchors.verticalCenter: parent.verticalCenter
                height: parent.height; width:(parent.width-parent.spacing-lockOpenImg.width);
                color:  "transparent"
                Text { text: parent.parent.text; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; }
                Text { text: parent.parent.text2; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; anchors.right: parent.right; anchors.rightMargin: (longest.width-width); }
            }
        }

        Row {
            id: rowLockClosed
            visible: false
            x: Math.round( structure.height * 0.05 )
            property string text : "Doors"
            property string text2 : "Locked"
            width: parent.width - x
            height: (visible)? Math.round( 30 * (structure.height / 424) ) : 0
            spacing: Math.round( 6 * (structure.width / 640) )
            Image { id: lockClosedImg; smooth: true; width: parent.height; height: parent.height; source: "images/lock_100x100.png" }
            Rectangle {
                anchors.verticalCenter: parent.verticalCenter
                height: parent.height; width:(parent.width-parent.spacing-lockClosedImg.width);
                color:  "transparent"
                Text { text: parent.parent.text; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; }
                Text { id: longest; text: parent.parent.text2; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; anchors.right: parent.right; }
            }
        }
        Row {
            id: rowAlarmOn

            property string text : "Alarm"
            property string text2 : "On"

            visible: false
            x: Math.round(structure.height * 0.05)

            width: parent.width - x
            height: (visible)? Math.round( 30 * (structure.height / 424)) : 0
            spacing: Math.round(6 * (structure.width / 640))
            Image { id: alarmOnImg; smooth: true; width: parent.height; height: parent.height; source: "images/alarm_40x40.png" }
            Rectangle {
                anchors.verticalCenter: parent.verticalCenter
                height: parent.height; width:(parent.width-parent.spacing-alarmOnImg.width);
                color:  "transparent"
                Text { text: parent.parent.text; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; }
                Text { text: parent.parent.text2; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; anchors.right: parent.right; anchors.rightMargin: (longest.width-width); }
            }
        }
        Row {
            id: rowAlarmOff

            property string text : "Alarm"
            property string text2 : "Off"

            visible: false
            x: Math.round(structure.height * 0.05)
            width: parent.width - x
            height: (visible)? Math.round(30 * (structure.height / 424)) : 0
            spacing: Math.round(6 * (structure.width / 640))
            Image { id: alarmOffImg; smooth: true; width: parent.height; height: parent.height; source: "images/alarm_40x40.png" }
            Rectangle {
                anchors.verticalCenter: parent.verticalCenter
                height: parent.height; width:(parent.width - parent.spacing - alarmOffImg.width);
                color:  "transparent"
                Text { text: parent.parent.text; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; }
                Text { text: parent.parent.text2; font.pixelSize: 1 + Math.round( 23 * (structure.height / 424) ); color: structure.style.textColor; anchors.verticalCenter: parent.verticalCenter; anchors.right: parent.right; anchors.rightMargin: (longest.width-width); }
            }
        }
    }

    Rectangle {
        visible: false
        color: "transparent"
        x: Math.round(structure.width * 0.05)
        y: Math.round(structure.height * 0.15)
        width: Math.round(330 * (structure.width/640))
        height: Math.round(330 * (structure.height/424))

        Text {
            id: displayText
            text: ""
            anchors.horizontalCenter: parent.horizontalCenter
            font.bold: true
            opacity: 0
            font.pixelSize: 1 + Math.round(20 * (structure.height / 424))

            states: State {
                name: "show"
                PropertyChanges { target: displayText; opacity: 100; font.pixelSize: 1 + Math.round( 30 * (structure.height / 424) ); }
            }
            Behavior on font.pixelSize { PropertyAnimation { duration: 200 } }
            Behavior on opacity { PropertyAnimation { duration: 200 } }
        }

        Text {
            id: displayTextSmall
            x: Math.round(structure.height * 0.05)
            y: Math.round(structure.height * 0.15)
            text: ""
            opacity: displayText.opacity
            font.pixelSize: 1 + Math.round( 22 * (structure.height / 424) )
        }
    }
}
